import React,{memo,useState} from 'react'
import { Avatar,Typography ,Badge } from 'antd'
const { Paragraph, Text } = Typography;
import {useNavigate} from "react-router";
function ItemList(props, ref){
  const navigate = useNavigate();
  let url = 'https://ts1.cn.mm.bing.net/th?id=OIP-C.Zte3ljd4g6kqrWWyg-8fhAHaEo&w=316&h=197&c=8&rs=1&qlt=90&o=6&pid=3.1&rm=2';
  const [count, setCount] = useState(0);
  const [selected,setSelected] = useState(0)
  const onUrl = (url,id)=>{
    navigate(url,{state:id})
  }
  const  urlFun = (id)=>{
    setSelected(id)
    navigate('/userPage/userInfo',{state: { id:id} })
  }

  return <>
   <div onClick={()=>urlFun(0)} className="im-item">
      <div className="im-item-l" style={{width:35}}>
        <Badge count={count}>
        <Avatar size={35} src={url} />
        </Badge>
      </div>
      <div className="im-item-r">
        <div className="im-r-t">
          <Text style={{color: "#333"}} className="text-l" ellipsis={true}>
              名字
          </Text>
        </div>
        <div className="im-r-t" >
          <Text style={{color: "#999999",fontSize:12}} ellipsis={true}>
            [在线]
          </Text>
        </div>
      </div>
   </div>
  </>

}

export default memo(ItemList);
